<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<script src="js/mui.min.js"></script>
		<link href="css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="css/sub.css" />
		<link rel="stylesheet" type="text/css" href="css/home.css" />
		<script type="text/javascript" charset="utf-8">
			mui.init();
		</script>
	</head>
	<body class="bg-f8">
	 <header class="mui-bar mui-bar-nav login">
	       <a class="mui-action-back mui-pull-left icon-left"></a>
	  </header>
	 <div class="login-cover">
	</div>
	<div class="login-bg">
		<img src="img/static/login-bg.png"/>
	</div> 
	<div class="mui-content">
		<div class="login-body pt1-88">
			<div class="reg-body-header">
				<img src="img/static/logo_wh.png"/>
			</div>
			<div class="login-form">
				<ul class="mui-clearfix mt12">
					<form action="" method="post" id="register-form">
						<li class="login-unl"><i class="icon-phone"></i><input type="text" name="phonenum" id="phonenum" value="" placeholder="请输入账号/手机号"/></li>
						<li class="login-unl"><i class="icon-myrepassword"></i><input type="password" name="password" id="password" value="" placeholder="请输入密码"/></li>
						<li class="login-unl"><i class="icon-myrepassword"></i><input type="password" name="repassword" id="repassword" value="" placeholder="请再次输入秘密"/></li>
						<li class="login-unl"><i class=" icon-journal"></i><input type="text" name="phonever" id="phonever" value="" placeholder="请输入验证码"/> <button class="ver-btn mui-pull-right" id="hqyzm">获取验证码</button></li>
						<li><button class="login-btn" id="register">注册</button></li>
						<li class="tc mt30"><a href="login.html" class="forget-href">已有账号登录</a></li>
					</form>
				</ul>
			</div>
		</div>
	</div>
	<script src="js/mod.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/jquery-1.9.1.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			/*验证码*/
			var yzm = null;
			$("#register").click(function() {
//				if(!$(".check-btn input").is(":checked"))
//				{
//					alert("你没有勾选轻松结婚用户协议");
//					return false;
//				}
				var loginData =setJson($("#register-form"));
				if(!/^[1](3|5|8|4)\d{9}$/.test(loginData.phonenum)) {
					mui.alert("手机号格式不对");
					return false;
				}
				if(!/^[a-zA-Z0-9]{6,18}$/.test(loginData.password)) {
					mui.alert("密码格式不对，6到18位大小写和数字");
					return false;
				}
				if(loginData.password!=loginData.repassword){
					mui.alert("2次输入的密码不一致");
					return false;
				}
				if(loginData.phonever!=yzm){
					mui.alert("验证码输入有误！")
					return false;
				}
				/*验证通过后ajax请求*/
				$.ajax({
					type: "post",
					url: "http://www.xhwed.com/xhwe.php/LoginRegistr/Enroll",
					datatype: "json",
					data: loginData,
					async: true,
					success: function(data) {
						data = JSON.parse(data);
						if(data.msg=="success")
						{
							mui.alert("注册成功！确认后跳转到登录页面！");
							window.location.href="login.html";
						}
					}
				});
				return false;
			});
			/*获取验证码点击*/
			$("#hqyzm").click(function() {
				//console.log($("#register-form").serializeArray()[0]);
				var mydata = setJson($("#register-form"));
				console.log(mydata);
				var reg = /^[1](3|5|8|4)\d{9}$/;
				if(reg.test(mydata.phonenum.replace(/\s/g,""))) {
					/*手机号匹配成功*/
					rePhone(getVerifi);
				} else mui.alert("手机号格式错误");
				return false;
			});
			/*获取验证码*/
			function getVerifi(){
				var mydata = setJson($("#register-form"));
				$.ajax({
						type: "post",
						url: "http://www.xhwed.com/xhwe.php/LoginRegistr/smsRegistr",
						datatype: "json",
						data: mydata,
						async: true,
						success: verAjax
					});
			}
			/*获取手机验证码*/
			function verAjax(data) {
				data = JSON.parse(data);
				if(data.msg == "fail") {
					mui.alert("验证码发送失败" + data.result);
				} else {
					yzm = data.result;
					$("#hqyzm").removeClass("reg-btn").addClass("reg-checked");
					$("#hqyzm").text("60s");
					$("#hqyzm").attr("disabled", true);
					/*定时器*/
					var varTime = setInterval(function() {
						var i = 60;
						return function() {
							i--;
							$("#hqyzm").text(i + "s");
							if(i <= 0) {
								clearInterval(varTime);
								$("#hqyzm").removeClass("reg-checked").addClass("reg-btn");
								$("#hqyzm").text("获取验证码");
								$("#hqyzm").attr("disabled", false);
							}
						}
					}(), 1000);
				}
			}
			/*设置表单数据转json*/
			function setJson($jq) {
				var data = {};
				$jq.serializeArray().map(function(x) {
					data[x.name] = x.value;
				});
				return data;
			}
			
			/*判读手机号码是否重复*/
			$("#phonenum").blur(function() {
				rePhone();
			});
			/*判断是否重复*/
			function rePhone(method){
				var mydata = setJson($("#register-form"));
				var reg = /^[1](3|5|8|4|7)\d{9}$/;
				console.log(mydata);
				if(reg.test(mydata.phonenum)) {
				 $.ajax({
				 	type:"post",
				 	url:"http://www.xhwed.com/xhwe.php/LoginRegistr/JudgeNumber",
				 	async:true,
				 	data:mydata,
				 	success:function(data){
				 		var data =JSON.parse(data);
				 		console.log(data);
				 		if(data.msg=="fail")
				 		{
				 			mui.alert("账号已经被注册！");
				 			$("#phonenum").text("");
				 		}
				 		if(data.msg=="success"){
				 			if(method){
				 				method();
				 			}
				 		}
				 	}
				 });	
				}
			}
		</script>
	</body>
</html>